---
layout: default
---

<script src="https://lf26-cdn-tos.bytecdntp.com/cdn/expire-99-y/jquery/1.2.3/jquery.min.js" type="application/javascript"></script>
<script>
/**
 * 分类展示（点击右侧的分类展示时，左侧的相关裂变展开或者收起）
 * @return {[type]} [description]
 */
function categoryDisplay() {
    /** only show All */
    $('.post-list-body>ul>div[post-cate!=All]').hide();
    /** show category when click categories list */
    $('.categories-list-item').click(function() {
        var cate = $(this).attr('cate');
        $('.post-list-body>ul>div[post-cate!=' + cate + ']').hide(250);
        $('.post-list-body>ul>div[post-cate=' + cate + ']').show(400);
        if(cate == 'All'){
            $('.pagination').show(400);
        }else{
            $('.pagination').hide(250);
        }
    });
}
$(document).ready(function() {
    categoryDisplay();
});
</script>
<div class="page clearfix" index>
    <div class="left">
        <!--<h1>文章列表</h1>-->
        <small>站在云端，敲下键盘，望着通往世界另一头的那扇窗，只为做那读懂0和1的人。。</small>
        <hr>
        <div class="post-list-body">
            <ul>
                <div post-cate="All">
                    {% for post in paginator.posts %}
                        <li>
                            <a class="post-link" style="font-size:20px;" href="{{ post.url }}">{{ post.title }}</a>
                            <hr style="margin: 12px 0">
                        </li>
                    {% endfor %}
                </div>
                <!-- 玄玉201805241800：预置各分类文章列表，供首页点击分类时动态显示 -->
                {% for category in site.categories %}
                    <div post-cate="{{category | first}}">
                        {% for posts in category %}
                            {% for post in posts %}
                                {% if post.url %}
                                    <li>
                                        <a class="post-link" style="font-size:20px;" href="{{ post.url }}">{{ post.title }}</a>
                                        <hr style="margin: 12px 0">
                                    </li>
                                {% endif %}
                            {% endfor %}
                        {% endfor %}
                    </div>
                {% endfor %}
            </ul>
            <!-- Pagination links -->
            <div class="pagination">
              {% if paginator.previous_page %}
                <a href="/" class="previous"><i class="fa fa-angle-double-left"></i></a>
                <a href="{{ paginator.previous_page_path }}" class="previous"><i class="fa fa-angle-left"></i></a>
              {% else %}
                <span class="previous disable"><i class="fa fa-angle-double-left"></i></span>
                <span class="previous disable"><i class="fa fa-angle-left"></i></span>
              {% endif %}
              <span class="page_number ">{{ paginator.page }}/{{ paginator.total_pages }}</span>
              {% if paginator.next_page %}
                <a href="{{ paginator.next_page_path }}" class="next"><i class="fa fa-angle-right"></i></a>
                <a href="/blog/page{{ paginator.total_pages }}/" class="next"><i class="fa fa-angle-double-right"></i></a>
              {% else %}
                <span class="next disable"><i class="fa fa-angle-right"></i></span>
                <span class="next disable"><i class="fa fa-angle-double-right"></i></span>
              {% endif %}
            </div>
        </div>
    </div>
    <!-- <button class="anchor"><i class="fa fa-anchor"></i></button> -->
    <div class="right">
        <div class="wrap">
            <!-- 玄玉202004141252：搜索框 -->
            <div class="side">
                <div>
                    <i class="fa fa-search" aria-hidden="true"></i>
                    实时搜索
                </div>
                {% include sidebar-search.html %}
            </div>
            <!-- 玄玉201805241800：预置各分类文章列表，供首页点击分类时动态显示 -->
            <div class="side ">
                <div>
                    <i class="fa fa-th-list"></i>
                    分类目录
                </div>
                 <ul class="content-ul" cate>
                    <li>
                        <a href="javascript:;" class="categories-list-item" cate="All">
                            <span class="name">
                                所有文章
                            </span>
                            <span class="badge"> {{site.posts | size}}</span>
                        </a>
                    </li>
                    {% for category in site.categories %}
                    <li>
                        <a href="javascript:;" class="categories-list-item" cate="{{ category | first }}">
                            <span class="name">
                                {{ category | first }}
                            </span>
                            <span class="badge">{{ category | last | size }}</span>
                        </a>
                    </li>
                    {% endfor %}
                </ul>
            </div>
        </div>
    </div>
</div>